<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="assets/css/layui.css">
    <link rel="stylesheet" href="assets/css/login.css">
    <link rel="icon" href="/favicon.ico">
    <title>管理后台</title>
</head>
<body class="login-wrap">
    <div class="login-container" id="app">
        <form class="login-form">
            <div class="input-group">
                <input type="text" id="username" v-model="user.username" class="input-field" >
                <label for="username" class="input-label">
                    <span class="label-title">用户名</span>
                </label>
            </div>
            <div class="input-group">
                <input type="password" id="password" v-model="user.password" class="input-field">
                <label for="password" class="input-label">
                    <span class="label-title">密码</span>
                </label>
            </div>
            <button type="button" class="login-button" v-on:click="login()">登录<i class="ai ai-enter"></i></button>
        </form>
    </div>
</body>
<script src="assets/layui.js"></script>
<script src="index.js" data-main="login"></script>
<script src="vue.min.js"></script>
<script src="axios.min.js"></script>
<script>
    new Vue({
        el: "#app",
        data: {
            user:{
                "rememberMe":false,
                "username":""
            }
        },
        created:function () {
           
        },

        methods: {
            
            login: function(){
                _this = this;
                axios.post("http://localhost:9004/auth/login",this.user).then(function(response){
                    
                    console.log(response.status);	//服务器返回的信息
                    console.log(response.headers.authorization);
                    if(response.status == 200){
                        localStorage.setItem('username',_this.user.username);
                        localStorage.setItem('Authorization',response.headers.authorization);
                        location.href="index.html";
                    }
                    
                }).catch(function(error){
                    //alert(error);
                    alert("用户名或密码不正确");
                    location.reload();
                })
            }
        }
    })
</script>
</html>